<template>
  <div>
    <search btn-text="添加影院" @searchCinema="searchCinema"></search>
    <table-info
      :headList="headList"
      :tableList="tableList"
      type="cinema"
      @deleteCinemaInfo="deleteCinemaInfo"
      @edit="edit"
    ></table-info>
    <el-pagination
      background
      layout="prev, pager, next"
      :total="total"
      :page-size="7"
      @current-change="change"
    >
    </el-pagination>
    <dia-log :isDialog="isDialog" @update="update"></dia-log>
  </div>
</template>

<script>
import { mapState, mapActions } from 'vuex'
import DiaLog from './dialog'
import {
  getCurrentPageCinema,
  deleteCinemaInfo,
  addCinemaInfo,
  updateCinemaInfo
} from '@/api/cinema'
export default {
  computed: {
    ...mapState('cinema', ['ruleForm'])
  },
  components: { DiaLog },
  data () {
    return {
      isDialog: false,
      currentPage: 1,
      pageSize: 7,
      total: 0,
      input: '',
      headList: [
        { id: 1, label: '影院ID', prop: 'cinema_id' },
        { id: 2, label: '影院名', prop: 'cinema_name' },
        { id: 3, label: '联系电话', prop: 'cinema_phone' },
        { id: 4, label: '详细地址', prop: 'specified_address' }
      ],
      tableList: []
    }
  },
  created () {
    this.getCurrentPageCinema(this.currentPage, this.pageSize, this.input)
  },
  methods: {
    ...mapActions('cinema', ['changeRuleForm']),
    async getCurrentPageCinema (currentPage, pageSize, input) {
      const { total, data } = await getCurrentPageCinema({
        currentPage,
        pageSize,
        input
      })
      console.log(data)
      this.tableList = data
      this.total = total
    },
    change (page) {
      this.currentPage = page
      this.getCurrentPageCinema(this.currentPage, this.pageSize, this.input)
    },
    // 删除
    async deleteCinemaInfo (val) {
      if ((this.total - 1) % this.pageSize === 0 && this.currentPage > 1) {
        this.currentPage -= 1
      }
      const res = await deleteCinemaInfo({ cinemaId: val })
      console.log(res)
      if (res.success_code === 200) {
        this.$message.success('删除成功')
        this.getCurrentPageMovie(this.currentPage, this.pageSize, this.input)
      } else {
        this.$message.error('删除失败')
      }
    },
    // 搜索
    searchCinema (val) {
      this.input = val
      this.getCurrentPageCinema(this.currentPage, this.pageSize, this.input)
    },
    // 添加
    async add (val) {
      const res = await addCinemaInfo(val)
      console.log(res)
      this.getCurrentPageCinema(this.currentPage, this.pageSize, this.input)
    },
    async edit (val) {
      console.log(val)
      const obj = {
        cinemaId: val.cinema_id,
        cinemaName: val.cinema_name,
        cinemaPhone: val.cinema_phone,
        address: val.specified_address
      }
      console.log(obj)
      this.changeRuleForm(obj)
    },
    async update () {
      const res = await updateCinemaInfo(this.ruleForm)
      console.log(res)
      if (res.success_code === 200) {
        this.$message.success('修改成功')
        this.getCurrentPageCinema(this.currentPage, this.pageSize, this.input)
        const obj = {
          cinemaName: '',
          cinemaPhone: '',
          address: ''
        }
        this.changeRuleForm(obj)
      } else {
        this.$message.error(res.message)
      }
    }
  }
}
</script>

<style>
</style>
